import './StarScore.scss';

import React from 'react';

/**
 * StarScore组件
 * @description <StarScore score={num}/>
 */

class StarScore extends React.Component {
    /**
     * 渲染5颗星得分方法
     *  @param {*} data
     */
    renderScore(){
        let starArr = [];

        let score = this.props.score || '';
        score = score.toString()
        let scoreArr = score.split('.');

        let fullStarNum = parseInt(scoreArr[0]);
        let halfStarNum = parseInt(scoreArr[1]) > 5 ? 1 : 0;
        let nullStarNum = 5 - fullStarNum - halfStarNum;
        for(let i = 0 ; i < fullStarNum; i ++) {
          starArr.push(<div key={i + 'full'} className="star fullstar"></div>)
        }

        if(halfStarNum) {
          for (let j = 0 ; j < halfStarNum ; j++) {
              starArr.push(<div key={j + 'half'} className="star halfstar"></div>)
          }
        }

        if(nullStarNum) {
          for (let k = 0 ; k < nullStarNum ; k++) {
              starArr.push(<div key={k + 'null'} className="star nullstar"></div>)
          }
        }

        return starArr;
    }
    render(){
        return <div className="star-score">{this.renderScore()}</div>;
    }

}

export default StarScore;
